<template>
  <div class="centers diolog_adapt">
    <el-form :model="addForm" ref="deliveryForm">
      <el-form-item label="用户名称:" label-width="140px">
        <el-input v-model="addForm.username" autocomplete="off" disabled></el-input>
      </el-form-item>
      <el-form-item label="型号选择:" label-width="140px" prop="thereId">
        <el-select v-model="addForm.thereId" placeholder="没有选中任何项" style="width:100%" disabled>
          <el-option v-for="item in lotoptions" :key="item.id" :label="item.name_code" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="需求类型:" label-width="140px" prop="demand_type">
        <el-select v-model="addForm.demand_type" placeholder="没有选中任何项" style="width:100%" disabled>
          <el-option v-for="item in condition" :key="item.id" :label="item.name" :value="item.name"></el-option>
        </el-select>
      </el-form-item>
      <div class="flex flex_bet">
        <el-form-item label="期望完成日期:" label-width="140px" prop="expect_time" class="boxitem">
          <el-date-picker v-model="addForm.expect_time" type="date" placeholder="选择日期" :picker-options="pickerOptions0" format="yyyy 年 MM 月 dd 日" value-format="timestamp" disabled>
          </el-date-picker>
        </el-form-item>
        <el-form-item label="计划完成日期:" label-width="140px" prop="plan_time" class="boxitem">
          <el-date-picker v-model="addForm.plan_time" type="date" placeholder="选择日期" :picker-options="pickerOptions0" format="yyyy 年 MM 月 dd 日" value-format="timestamp" disabled></el-date-picker>
        </el-form-item>
      </div>
      <div v-for="(item,index) in addForm.deliver" :key="index">
        <el-form-item :label="`匹配硬件版本${index + 1}`" label-width="140px">
          <el-input v-model="item.name_code" autocomplete="off" :placeholder="`请输入匹配硬件版本${index + 1}`"></el-input>
        </el-form-item>
        <el-form-item label="固件版本信息" label-width="140px">
          <el-input v-model="item.firmware_version" autocomplete="off" placeholder="请输入固件版本信息"></el-input>
        </el-form-item>
        <el-form-item label="固件下载信息" label-width="140px">
          <el-input v-model="item.firmware_address" autocomplete="off" placeholder="固件下载信息"></el-input>
        </el-form-item>
        <el-form-item label="固件简单描述" label-width="140px">
          <el-input v-model="item.remark" autocomplete="off" placeholder="固件简单描述"></el-input>
        </el-form-item>
        <div class="flex flex_bet">
          <el-form-item label="实际交付日期" label-width="140px" class="boxitem">
            <el-date-picker v-model="item.actual_time" type="date" placeholder="选择日期" :picker-options="pickerOptions0" format="yyyy 年 MM 月 dd 日" value-format="timestamp" @change="deliveryDate($event,index)">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="完成耗时" label-width="140px" class="boxitem">
            <el-input v-model="item.take_time" autocomplete="off" placeholder="完成耗时" disabled></el-input>
          </el-form-item>
        </div>
      </div>
      <div class="flex flex_bet felx_align hardwareDate">
        <el-form-item label="CPU" label-width="140px" class="boxitem">
          <el-input v-model="addForm.cpu" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="运存RAM" label-width="140px" class="boxitem">
          <el-input v-model="addForm.start_ram" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="存储ROM" label-width="140px" class="boxitem">
          <el-input v-model="addForm.storage_rom" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="显示屏" label-width="140px" class="boxitem">
          <el-input v-model="addForm.display" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="触摸屏" label-width="140px" class="boxitem">
          <el-input v-model="addForm.touch_screen" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="前摄像头" label-width="140px" class="boxitem">
          <el-input v-model="addForm.prefix_camera" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="后摄像头" label-width="140px" class="boxitem">
          <el-input v-model="addForm.suffix_camera" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="电池" label-width="140px" class="boxitem">
          <el-input v-model="addForm.battery" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="其他特殊说明" label-width="140px" class="boxitem" style="width:100%">
          <el-input v-model="addForm.other" autocomplete="off" disabled></el-input>
        </el-form-item>
      </div>
      <el-form-item label="开机LOGO:" label-width="140px">
        <el-input v-model="addForm.start_logo" autocomplete="off" placeholder="请上传开机logo图" disabled></el-input>
      </el-form-item>
      <el-form-item label="开机动画:" label-width="140px">
        <el-input v-model="addForm.start_animation" autocomplete="off" placeholder="请上传开机动画" disabled></el-input>
      </el-form-item>
      <el-form-item label="开机铃声:" label-width="140px">
        <el-input v-model="addForm.start_ring" autocomplete="off" placeholder="请输入开机铃声格式" disabled></el-input>
      </el-form-item>
      <el-form-item label="默认壁纸:" label-width="140px">
        <el-input v-model="addForm.wallpaper" autocomplete="off" placeholder="请上传默认壁纸" disabled></el-input>
      </el-form-item>
      <el-form-item label="应用内置需求:" label-width="140px">
        <el-input v-model="addForm.app_demand" autocomplete="off" placeholder="请输入应用内置需求" disabled></el-input>
      </el-form-item>
      <el-form-item label="Launcher桌面需求:" label-width="140px">
        <el-input v-model="addForm.launcher_desktop" autocomplete="off" placeholder="请输入Launcher桌面需求" disabled></el-input>
      </el-form-item>
      <el-form-item label="系统语言需求:" label-width="140px">
        <el-input v-model="addForm.language" autocomplete="off" placeholder="请输入系统语言需求" disabled></el-input>
      </el-form-item>
      <el-form-item label="系统输入法需求:" label-width="140px">
        <el-input v-model="addForm.type_writing" autocomplete="off" placeholder="请输入系统输入法需求" disabled></el-input>
      </el-form-item>
      <el-form-item label="OTA升级需求:" label-width="140px">
        <el-input v-model="addForm.ota_demand" autocomplete="off" placeholder="请输入OTA升级需求" disabled></el-input>
      </el-form-item>
      <el-form-item label="其他需求补充:" label-width="140px">
        <el-input v-model="addForm.other_demand" autocomplete="off" placeholder="其他需求补充或直接导入xlsx表格" style="flex:1" disabled></el-input>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { getCreateDigits } from "@/api/snControl.js";
import { queryFirmwareDeliver, deliverFirmwareDeliver } from "@/api/firmware.js";
export default {
  props: {
    deliveryId: {
      type: Number,
      default() {
        return 1
      }
    }
  },
  data() {
    return {
      //型号选择：第3/4位选择框
      lotoptions: [],
      //需求选择框
      condition: [{ id: 1, name: '新创需求' }, { id: 2, name: '补充需求' }, { id: 3, name: '解BUG' }],
      //限制日期选择框范围
      pickerOptions0: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      },
      addForm: {}
    }
  },
  created() {
    this.getCreateDigitss(3)
    this.getqueryFirmwareDeliver(this.deliveryId)
    console.log('传过来的ID', this.deliveryId)
  },
  methods: {
    //交付固件
    getdeliverFirmwareDeliver() {
      this.$refs.deliveryForm.validate(valid => {
        if (valid) {
          let addForm = JSON.parse(JSON.stringify(this.addForm))
          let data = {}
          data.userId = localStorage.getItem("ID")
          data.last_ip = sessionStorage.getItem("Ip")
          addForm.deliver.forEach(item => {
            item.actual_time = item.actual_time / 1000
            item.take_time = item.take_time ? Number(item.take_time.toString().replace(/[\u4e00-\u9fa5]/g, "")) : ''
          })
          data.firmware = JSON.stringify(addForm.deliver)
          data.id = this.deliveryId
          deliverFirmwareDeliver(data).then(res => {
            this.$message.success(res.msg)
            this.$emit('closeDelivery')
            this.$emit('getqueryFirmwareCustom')

          }).catch(err => {
            this.$emit('closeDelivery')
          })
        } else {
          return false
        }
      })
    },
    getqueryFirmwareDeliver(id) {
      queryFirmwareDeliver({ id: id }).then(res => {
        this.addForm = res.data
        this.addForm.expect_time = res.data.expect_time * 1000
        this.addForm.plan_time = res.data.plan_time * 1000
        this.addForm.thereId = res.data.dId
        this.addForm.deliver.forEach(item => {
          item.actual_time ? item.actual_time = item.actual_time * 1000 : ''
          item.take_time ? item.take_time = item.take_time.toString() + '天' : ''
        })
        console.log('交付数据', res.data)
      }).catch(err => {
        this.addForm = []
      })
    },
    //获取1、2、3位数信息
    getCreateDigitss(type) {
      getCreateDigits({ type: type }).then(res => {
        this.lotoptions = res.data
      }).catch(err => {
        this.lotoptions = false
      })
    },
    deliveryDate(val, index) {
      this.addForm.deliver[index].take_time = this.intervalTime(this.addForm.plan_time / 1000, val / 1000)
      //console.log('开始时间',this.addForm.plan_time,'结束时间',val,'计算天数')
    },
    //计算两个时间之间的时间差 多少天时分秒
    intervalTime(startTime, endTime) {
      // var timestamp=new Date().getTime(); //计算当前时间戳
      var timestamp = (Date.parse(new Date())) / 1000;//计算当前时间戳 (毫秒级)
      var date1 = ""; //开始时间
      if (timestamp < startTime) {
        date1 = startTime;
      } else {
        date1 = timestamp; //开始时间
      }
      var date2 = endTime; //结束时间
      // var date3 = date2.getTime() - date1.getTime(); //时间差的毫秒数
      var date3 = (date2 - date1) * 1000; //时间差的毫秒数
      //计算出相差天数
      var days = Math.floor(date3 / (24 * 3600 * 1000));
      //计算出小时数

      var leave1 = date3 % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
      var hours = Math.floor(leave1 / (3600 * 1000));
      //计算相差分钟数
      var leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
      var minutes = Math.floor(leave2 / (60 * 1000));

      //计算相差秒数

      var leave3 = leave2 % (60 * 1000); //计算分钟数后剩余的毫秒数
      var seconds = Math.round(leave3 / 1000);
      //console.log(days + "天 " + hours + "小时 ")
      // return   days + "天 " + hours + "小时 " + minutes + " 分钟" + seconds + " 秒"
      return days + "天 "
    }
  }
}
</script>

<style scoped lang="scss">
.hardwareDate {
  display: flex;
  flex-wrap: wrap;
}
.boxitem {
  width: 49%;
}
</style>

<style scoped>
/deep/ .el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: 100%;
}
</style>